<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="js/mui.min.js"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="./css/index.css">
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>
	<body>
		<!-- 切换子页面 -->
		<div class="cont">

			<!-- 首页内容 -->
			<div class="mui-content box">

				<!-- 导航 -->
				<header class="mui-bar mui-bar-nav head">
					<h1 class="mui-title">首页</h1>
					<img src="./images/nav-logo.png" alt="">
				</header>

				<!-- 轮播图 -->
				<div class="mui-content">
					<!-- 轮播图 -->
					<div class="mui-slider">
						<div class="mui-slider-group">
							<div class="mui-slider-item"><a href="javascript:;"><img src="./images/345.png" /></a>
							</div>
							<div class="mui-slider-item"><a href="javascript:;"><img src="./images/789.png" /></a>
							</div>
							<div class="mui-slider-item"><a href="javascript:;"><img src="./images/123.png" /></a>
							</div>
							<div class="mui-slider-item"><a href="javascript:;"><img src="./images/91011.png" /></a>
							</div>
						</div>
					</div>
				</div>

				<!--工作提示 + 轮播图-->
				<div class="title">
					<img src="./images/gonggao.png" alt="">
					<div class="mui-scroll-wrapper" style="top: 250px; left: 160px; width: 215px;">
						<div class="mui-scroll">
							<!-- 这里放置真实显示的DOM内容 -->
							<div class="scrollDiv" id="s1" style="height: 20px; overflow: hidden;">
								<ul>
									<li>[限定秒杀]万岳科技,双十一活...</li>
									<li>[肥城农商银行·紧急提醒]谨防...</li>
									<li>新的一月!新的气息!</li>
								</ul>
							</div>
						</div>
					</div>
				</div>

				<!-- 推荐文章 -->
				<ul class="mui-table-view li_item" style="margin-bottom: 50px;">
					<li class="mui-table-view-cell wenzhang">
						<a class="mui-navigate-right">
							<span class="spn123"></span>
							推荐文章
							<span class="spn234"
								style="float: right; margin-right: 20px; color: #ccc; margin-top: 3px;">更多</span>
						</a>
					</li>

					<!--  推荐文章内容  -->
					<!-- <li class="mui-table-view-cell item">
						<a href="./html/articles.html">
							<div class="item1">
								<img src="${item.img}" alt="">
								<div class="item_title" style="display:flex; flex-direction: column;
					justify-content: space-between;">
									<span>${item.title}</span>
									<span>${item.time}</span>
								</div>
							</div>
						</a>
					</li> -->
				</ul>

			</div>

			<!-- 学习手册 -->
			<div class="mui-content box">
				<!-- 推荐文章 -->
				<ul class="mui-table-view know" style="margin-bottom: 50px; margin-top: 0;">
					<li class="mui-table-view-cell bnt_3">
						<span class="spn123"></span>
						党史知识
						<span class="spn234" style="float: right; color: #ccc; margin-top: 3px;">更多 > </span>
					</li>
					<div id="box_content">
						<!-- <div class="cont">
							<img src="./images/add.png" alt="">
							<h4>title</h4>
							<p>time</p>
						</div> -->
					</div>
				</ul>

				<!-- 党建参阅 -->
				<ul class="mui-table-view" style="margin-bottom: 50px; margin-top: -50px;">
					<li class="mui-table-view-cell bnt_4">
						<span class="spn123"></span>
						党史参阅
						<span class="spn234" style="float: right; color: #ccc; margin-top: 3px;">更多 > </span>
					</li>
				</ul>
				<ul class="mui-table-view item_tt" style="margin-top: -50px; margin-bottom: 50px;">
					<!-- <li class="mui-table-view-cell ">
				        <a class="mui-navigate-right" style="position: relative; padding-bottom: 30px;" href="html/ref.html">
							<span><strong>党建学习参阅</strong></span>
							<p style="position: absolute; bottom: 0;">2021</p>
						</a>
				    </li> -->
				</ul>
			</div>

			<!-- 先模风采 -->
			<div class="mui-content box">
				<!-- 头部标签 -->
				<header class="mui-bar mui-bar-nav">
					<h1 class="mui-title">先模风采</h1>
				</header>
				<!-- 党支部切换 -->
				<div class="mui-content">
					<!-- 点击按钮 -->
					<ul class="mui-table-view" style="margin-top: 0;">
						<li class="mui-table-view-cell" id="menuBtn">
							<a class="mui-navigate-right">所有党支部</a>
						</li>
					</ul>
					<!-- 添加一个菜单 -->
					<ul id="menu" class="mui-popover mui-popover-bottom mui-popover-action"
						style="bottom: 50px; background-color: white;">
						<li class="li_ite">所有党支部</li>
						<li class="li_ite">岱庙</li>
						<li class="li_ite">上高</li>
						<li class="li_ite">财源</li>
						<li class="li_ite">徐家楼</li>
						<li class="li_ab">取消</li>
					</ul>
				</div>
				<!-- 内容 -->
				<div class="mui-content">
					<ul class="mui-table-view ch_r" style="margin-top: -45px;">
						<!-- <li class="mui-table-view-cell mui-media">
					        <a href="javascript:;" href="html/dzb.html">
					            <img class="mui-media-object mui-pull-left" src="./images/add.png">
					            <div class="mui-media-body">
					                李子申
					                <p class='mui-ellipsis'>上高&nbsp;&nbsp;|&nbsp;&nbsp;普通党员</p>
					                <p class='mui-ellipsis'>个人简介</p>
					            </div>
					        </a>
					    </li> -->
					</ul>
				</div>
			</div>

			<!-- 登陆注册 -->
			<div class="mui-content box box4">
				<div class="bg">
					<div id="gl">
						<img src="./images/login_logo_wanyue.png" alt="">
						<img src="./images/login_text.png" alt="">
					</div>
					<div class="ipt">
						<div class="mui-input-row">
							<label>账号:</label>
							<input type="text" required class="mui-input-clear name" name='name' placeholder="请输入用户名">
						</div>
						<div class="mui-input-row">
							<label>密码:</label>
							<input type="password" required class="mui-input-clear mui-input-password password"
								placeholder="请输入密码">
						</div>
						<div class="mui-input-row">
							<label>邮箱号:</label>
							<input type="email" required class="mui-icon-email email" name='email' placeholder="请输入邮箱">
							<input type="button" value="获取验证码" id="bt">
						</div>
						<div class="mui-input-row">
							<label>邮箱验证码:</label>
							<input type="email" required class="mui-icon-email email123" name='email'
								placeholder="请输入验证码">
						</div>
					</div>
					<button type="submit" class="button">注册/登陆</button>
				</div>
			</div>


			<!-- 登陆界面 -->
			<div class="mui-content login">
				<!-- 导航 -->
				<header class="mui-bar mui-bar-nav head">
					<h1 class="mui-title">我的</h1>
					<img src="./images/nav-logo.png" alt="">
				</header>
				<div class="mui-content">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell">
							<a class="mui-navigate-right a_right">
								<div id="right_a">
									<img class="img2" src="./images/avatar.png" alt="">
									<!-- <span class="spn1">123</span> -->
								</div>
							</a>
						</li>
						<li class="mui-table-view-cell">
							<a class="mui-navigate-right but_his"><img src="./images/my3.png" alt="">浏览历史</a>
						</li>
						<li class="mui-table-view-cell">
							<a class="mui-navigate-right"><img src="./images/my4.png" alt="">消息通知</a>
						</li>
						<li class="mui-table-view-cell but_xg">
							<a class="mui-navigate-right"><img src="./images/my2.png" alt="">修改密码</a>
						</li>
					</ul>  
					<button class="btn3">退出登陆</button>
				</div>
			</div>
		</div>




		<!-- 底部导航 -->
		<nav class="mui-bar mui-bar-tab" style="background-color: red;">
			<a class="mui-tab-item btn mui-active">
				<span class="mui-icon"><img src="./images/tabbar-2.png" alt="" class="img1"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item btn">
				<span class="mui-icon"><img src="./images/tabbar-3.png" alt="" class="img1"></span>
				<span class="mui-tab-label">学习手册</span>
			</a>
			<a class="mui-tab-item btn">
				<span class="mui-icon"><img src="./images/tabbar/xianmo.png" alt="" class="img1"></span>
				<span class="mui-tab-label">先模风采</span>
			</a>
			<a class="mui-tab-item btn">
				<span class="mui-icon"><img src="./images/tabbar-7.png" alt="" class="img1"></span>
				<span class="mui-tab-label">我的</span>
			</a>
		</nav>
	</body>
	<script src="./js/index.js"></script>
	<script>
		var gallery = mui('.mui-slider');
		gallery.slider({
			interval: 2000 //自动轮播周期，若为0则不自动播放，默认为0；
		});
	</script>
</html>